<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<title>loader &lsaquo; KISSY Docs</title>
<link rel="stylesheet" href="../assets/base-min.css" />
<link rel="stylesheet" href="../assets/docs.css" />
</head>
<body class="w866">
<div id="header">
    <a class="logo" href="../index.html"><img src="../assets/logo.png" alt="KISSY" width="138" height="74" /></a>
    <p class="rel-nav">
        <a href="http://github.com/kissyteam/kissy/tree/master/src/seed/loader.js"><code>loader.js</code></a>
    </p>
</div>
<div id="content" class="layout grid-s232m0">
    <div class="col-main">
        <div class="main-wrap">
            
            <div class="section summary">
                <p> loader 是一个处理脚本依赖关系的加载器，实现了按需加载、延迟加载、加载相关联的 js/css 等功能。</p>
                <p class="tips">更多关于 loader 的设计与分析，见<a href="http://www.uedmagazine.com/ued/comments.php?y=10&m=08&entry=entry100814-104521"> KISSY loader 的设计</a> </p>
            </div>
            <div class="section">
                <h3 id="methods">Methods</h3>

                <div class="member method">
                    <h4>
                        <a name="method_add">add</a>
                        <code>KISSY <em>add</em> ( name, fn, config )</code>
                    </h4>
                    <div class="detail">
                        <p>注册一个模块到 KISSY 中。</p>
                        <dl class="parameters">
                            <dt>Parameters:</dt>
                            <dd>
                                <code class="param-name">name</code>
                                <code class="param-type">&lt;String&gt;</code>
                                模块的名字。
                            </dd>
                            <dd>
                                <code class="param-name">fn</code>
                                <code class="param-type">&lt;Function&gt;</code>
                                注册指定模块到 KISSY 中的入口方法。
                            </dd>
                            <dd>
                                <code class="param-name">config</code>
                                <code class="param-type">&lt;Object&gt;</code>
                                配置信息，有如下一些可用选项：
<pre class="example-code"><code>
config = {
    path: 'packages/core-min.js',                          // 脚本相对路径
    fullpath: 'http://xxxx/build/packages/core-min.js',    // 脚本绝对路径
    csspath:  'cssbase/base-min.css',                      // CSS 文件相对路径
    cssfullpath: 'http://xxxx/build/cssbase/base-min.css', // CSS 文件绝对路径
    requires: ['mod1','mod2']                              // 指定依赖的模块
}
</code></pre>
                            </dd>
                        </dl>
                        <dl class="return">
                            <dt>Returns: <code>KISSY</code></dt>
                            <dd>KISSY 对象。</dd>
                        </dl>
                    </div>
<pre class="example-code"><code>
var S = KISSY;

S.app('TEST');

// 为模块添加命名空间
TEST.namespace('mods');

// 添加模块依赖关系
TEST.add({
    'test-core': {
        fullpath: 'http://xxxx/build/packages/core-min.js'
    },
    'test~global': {
        requires: ['test-core']
    }
});
</code></pre>
                </div>

                <div class="member method">
                    <h4>
                        <a name="method_use">use</a>
                        <code>KISSY <em>use</em> ( modNames, callback)</code>
                    </h4>
                    <div class="detail">
                        <p>开始加载所需模块，并且在所需模块加载完毕后，执行回调函数。</p>
                        <dl class="parameters">
                            <dt>Parameters:</dt>
                            <dd>
                                <code class="param-name">modNames</code>
                                <code class="param-type">&lt;String&gt;</code>
                                模块的名字，多个模块以“,”分隔。
                            </dd>
                            <dd>
                                <code class="param-name">callback</code>
                                <code class="param-type">&lt;Function&gt;</code>
                                加载所需模块完毕后执行的回调函数。
                            </dd>
                        </dl>
                        <dl class="return">
                            <dt>Returns: <code>KISSY</code></dt>
                            <dd>KISSY 对象。</dd>
                        </dl>
                    </div>
<pre class="example-code"><code>
KISSY.use('sizzle', function(){
    console.log(S.get('.menu .submenu a'));
});
</code></pre>
                </div>
            </div>
        </div>
    </div>
    <div class="col-sub">
        <div class="sub-wrap">
            <div class="loc">
                <a href="../index.html">home</a> &rsaquo;
                <a href="index.html">seed</a> &rsaquo;
                loader :
            </div>
            <div class="toc">
                <h3>Methods</h3>
                <ul>
                    <li><a href="#method_add">add</a></li>
                    <li><a href="#method_use">use</a></li>
                </ul>
            </div>
        </div>
    </div>
</div>
<div id="footer">
    <p class="copyright">&copy; 2009 - 2029 KISSY UI LIBRARY</p>
</div>
</body>
</html>
